import React from 'react';
import { useDrag, useDrop } from 'react-dnd';
const MaterialItem = ({ item }: any) => {
  const [{isDragging}, drag] = useDrag(() => ({
    collect(monitor) {
      return {
        isDragging: monitor.isDragging()
      }
    },
    type: '111', item: item.item
  }))

  return (<div style={{
    opacity:isDragging?0.5:1,
    backgroundImage: `url(${item.preview})`
  }} className='material-item' ref={(node) => drag(node)}>{item.name}</div>)
}
export default MaterialItem